.title {
    align-items: center;
    font-size: 20px;
}

.top-category {
    justify-content: center;
    display: flex;
    align-content: center;
    align-items: center;
    height: 50px;
    background: rgb(209, 192, 192);
}

.top-category span {
    color: white;
    padding-left: 10px;
    padding-right: 10px;
    margin-left: 10px;
    border-bottom-style: dashed;
    border-bottom-color: red;
    border-bottom-width: 1px;
    background: yellowgreen;
    height: 50px;
    text-align: center;
    stroke: rebeccapurple;
    border-bottom-style: none;
    display: flex;
    align-content: center;
    align-items: center;
}

.top-category span a {
    color: white;
}

.top-category span :hover {
    color: rebeccapurple;
    border-bottom-style: dashed;
}

.main-container {
    background: rgb(117, 93, 93);
    display: flex;
    flex: 3;
    padding: 60px 30px 30px 0px;

}

.blog-list-container {
    /* background: rgb(111, 131, 77); */
    flex: 2;
    margin: 0px 30px 0px 30px;

}

.blog-container {
    background: white;
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 4px;
}

.user-container {
    flex: 1;
}

.rightBox {
    background: rgb(135, 177, 135);
    margin: 0px 0 10px 0;
    padding: 10px;
    width: 250px;
    border-radius: 3px;
}

.button {
    background: orange;
    color: white;
    width: 150px;
}

.colDark {
    background: orange;
}